.demo-3 {
	position:relative;
	width:300px;
	height:400px;
	overflow:hidden;
	float:left;
	margin-right:20px;
}
.demo-3 figure {
    margin:0;
    padding:0;
    position:relative;
    cursor:pointer;
    margin-left:-50px
}
.demo-3 figure img {
    display:block;
    position:relative;
    z-index:10;
    margin:-15px ;
}
.demo-3 figure figcaption {
	position: absolute;
	top: 100%;
	left:100%;
	right: 100%;
	bottom: 100%;
	margin: auto;
	min-width: 100%;
	min-height: 100%;
	display:block;
	z-index:5;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box
	
}
.demo-3 figure h2 {
    font-family:'Lato';
    color:#000000;
    font-size:20px;
    text-align:left;
}
.demo-3 figure p {
    display:block;
    font-family:'Lato';
    font-size:30px;
    line-height:35px;
    margin:0;
    color:#000000;
    text-align:left;
}
.demo-3 figure figcaption {
	top:0px;
	left:-13px;
	width:600px;
	height:1193px;
	padding:29px 44px;
	background-color:rgba(26,76,110,0.5);
	background-color:#A7433D;
	text-align:center;
	backface-visibility:hidden;
	-webkit-transform:rotateY(-180deg);
	-moz-transform:rotateY(-180deg);
	transform:rotateY(-180deg);














    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    transition:all .5s
}
.demo-3 figure img {
    backface-visibility:hidden;
    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    transition:all .5s
	
}
.demo-3 figure:hover img,figure.hover img {
    -webkit-transform:rotateY(180deg);
    -moz-transform:rotateY(180deg);
    transform:rotateY(180deg)
}
.demo-3 figure:hover figcaption,figure.hover figcaption {
    -webkit-transform:rotateY(0);
    -moz-transform:rotateY(0);
    transform:rotateY(0)
}
#genel {
	height: auto;
	width: auto;
}
a:visited {
	color: #000000;
	text-decoration: none;
}
a:link {
	color: #FFFFFF;
	text-decoration: none;
}
#genel {
	height: 100%;
	width: 100%;
}